<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
    <title>悦章科技机构平台</title>
    <script src="/Public/static/jquery-2.0.3.min.js"></script>
    <script src="/Public/static/layer/layer.js"></script>
    <script type="text/javascript" src="/Public/static/echarts.js"></script>
    <!--内容样式-->
    <link rel="stylesheet" href="__PUBLIC__/Home/css/style.css" />
</head>

<body>
<div class="main">

    <include file="menu" />

    <!--  右侧内容  -->
    <div class="content">


        <div class= "ct-title">
            <div class="ctt-bt">数据统计</div>
            <div class="ctt-r" style="display: none;">
                <div class="cttr-zd">学籍状态：</div>
                <div class="cttr-tab">
                    <div class="cttrt-btn on">在读</div>
                    <div class="cttrt-btn">休学</div>
                    <div class="cttrt-btn">退学</div>
                    <div class="cttrt-btn">已毕业</div>
                    <div class="divclear"></div>
                </div>
                <div class="divclear"></div>
            </div>
            <div class="divclear"></div>
        </div>

        <div class="sjtj-box">
            <div class="sb-box" style="margin-left: 0;">
                <div class="sbb-bt">线索</div>
                <div class="sbb-sl">
                    <h3 style="color: #2a6bff;">{$transferred}</h3>
                    <span>转客户数</span>
                </div>
                <div class="sbb-sl" style="border: none;">
                    <h3>{$clue_count}</h3>
                    <span>线索数</span>
                </div>
                <div class="divclear"></div>
                <div class="sbb-jd">
                    <span style="background: #2a6bff;width:{$customerTransferRate}%"></span>
                </div>
                <div class="sbb-l">转客户率</div>
                <div class="sbb-r" style="color: #2a6bff;">{$customerTransferRate}%</div>
                <div class="divclear"></div>
            </div>
            <div class="sb-box">
                <div class="sbb-bt">学生</div>
                <div class="sbb-sl">
                    <h3 style="color: #2a6bff;">{$deal_customer_count}</h3>
                    <span>转成交数</span>
                </div>
                <div class="sbb-sl" style="border: none;">
                    <h3>{$customer_count}</h3>
                    <span>客户数</span>
                </div>
                <div class="divclear"></div>
                <div class="sbb-jd">
                    <span style="background: #2a6bff;width:{$dealRate}%"></span>
                </div>
                <div class="sbb-l">转成交率</div>
                <div class="sbb-r" style="color: #2a6bff;">{$dealRate}%</div>
                <div class="divclear"></div>
            </div>
            <div class="sb-box">
                <div class="sbb-bt">成交</div>
                <div class="sbb-sl">
                    <h3 style="color: #2a6bff;">{$introduce_customer_count}</h3>
                    <span>转介绍数</span>
                </div>
                <div class="sbb-sl" style="border: none;">
                    <h3>{$customer_count}</h3>
                    <span>客户数</span>
                </div>
                <div class="divclear"></div>
                <div class="sbb-jd">
                    <span style="background: #2a6bff;width:{$introduceRate}%"></span>
                </div>
                <div class="sbb-l">转介绍率</div>
                <div class="sbb-r" style="color: #2a6bff;">{$introduceRate}%</div>
                <div class="divclear"></div>
            </div>
            <div class="sb-box">
                <div class="sbb-bt">营业额</div>
                <div class="sbb-sl">
                    <h3 style="color: #ff6e17;">{$turnover}</h3>
                    <span>总计(万元)</span>
                </div>
                <div class="sbb-sl" style="border: none;">
                    <h3>{$dayTurnover}</h3>
                    <span>今日(万元)</span>
                </div>
                <div class="divclear"></div>
                <div class="sbb-jd">
                    <span style="background: #ff6e17;width:{$yye_increase}%"></span>
                </div>
                <div class="sbb-l">较昨日增长</div>
                <div class="sbb-r" style="color: #ff6e17;">{$yye_increase}%</div>
                <div class="divclear"></div>
            </div>
            <div class="sb-box">
                <div class="sbb-bt">跟进</div>
                <div class="sbb-sl">
                    <h3 style="color: #37c268;">{$follow_count}</h3>
                    <span>总计(个)</span>
                </div>
                <div class="sbb-sl" style="border: none;">
                    <h3>{$day_follow_count}</h3>
                    <span>今日(个)</span>
                </div>
                <div class="divclear"></div>
                <div class="sbb-jd">
                    <span style="background: #37c268;width:{$gj_increase}%"></span>
                </div>
                <div class="sbb-l">较昨日增长</div>
                <div class="sbb-r" style="color: #37c268;">{$gj_increase}%</div>
                <div class="divclear"></div>
            </div>
            <div class="divclear"></div>
        </div>


        <div class= "ct-title" style="margin-top: 60px;">
            <div class="ctt-bt">招生数据</div>
            <div class="ctt-r">
                <div class="cttr-tab">
                    <div <if condition="$search eq 1">class="cttrt-btn on"<else/>class="cttrt-btn"</if> onclick="retrieval(1)">今天</div>
                    <div <if condition="$search eq 2">class="cttrt-btn on"<else/>class="cttrt-btn"</if> onclick="retrieval(2)">昨天</div>
                    <div <if condition="$search eq 3">class="cttrt-btn on"<else/>class="cttrt-btn"</if> onclick="retrieval(3)">最近七天</div>
                    <div class="divclear"></div>
                </div>
                <form class="cttr-bd">
                    <select class="cttrb-xl" style="display: none;">
                        <option>招生分析</option>
                    </select>
                    <div class="cttrb-sj">
                        <input type="date" name="start_time" value="{$start_time}">
                        <img src="__PUBLIC__/Home/images/img_zhi.png" />
                        <input type="date" name="end_time" value="{$end_time}">
                        <div class="divclear"></div>
                    </div>
                    <a class="cttrb-cx" onclick="query()">查询</a>
                    <div class="divclear"></div>
                </form>
                <div class="divclear"></div>
            </div>
            <div class="divclear"></div>
        </div>

        <div class="tbfx-box">
            <div class="tb-title">图表分析</div>
            <!--<div class="tb-tb">图表插件区域</div>-->
            <div class="tb-tb">
                <div id="container" style="height: 100%"></div>
            </div>
        </div>


        <div class= "ct-title" style="margin-top: 60px;">
            <div class="ctt-bt">排行榜</div>
            <div class="ctt-r">
                <form class="cttr-bd">
                    <a class="cttrb-xz" href="招生系统-排行榜.html">更多</a>
                    <div class="divclear"></div>
                </form>
                <div class="divclear"></div>
            </div>
            <div class="divclear"></div>
        </div>

        <div class="ct-table">
            <table width="100%" border="0" style="width: 740px;float: left;">
                <tbody>
                <tr>
                    <th scope="col" width="28%" style="border-top-left-radius: 10px;">联系数排行</th>
                    <th scope="col" width="18%">联系线索</th>
                    <th scope="col" width="18%">联系客户</th>
                    <!--<th scope="col" width="18%">联系学生</th>-->
                    <th scope="col" width="18%" style="border-top-right-radius: 10px;">联系总数</th>
                </tr>
                <volist name="contactNumberList" id="vo" key="key">
                    <tr>
                        <td><span style="background:#fc2300;">{$key}</span>{$vo.username}</td>
                        <td>{$vo.clue}/{$vo.clue_count}</td>
                        <td>{$vo.customer}/{$vo.customer_count}</td>
                        <!--<td>0/0</td>-->
                        <td>{$vo.total_contact_number}/{$vo.total_count}</td>
                    </tr>
                </volist>
                </tbody>
            </table>
            <table width="100%" border="0" style="width:calc((100% - 800px) / 2);float: left;margin-left: 30px;">
                <tbody>
                <tr>
                    <th scope="col" width="60%" style="border-top-left-radius: 10px;">营业额排行</th>
                    <th scope="col" width="40%" style="border-top-right-radius: 10px;">金额</th>
                </tr>
                <volist name="yye_list" id="vo" key="key">
                    <tr>
                        <td><span style="background:#fc2300;">{$key}</span>{$vo.username}</td>
                        <td>{$vo.pay_price}</td>
                    </tr>
                </volist>
                </tbody>
            </table>
            <table width="100%" border="0" style="width:calc((100% - 800px) / 2);float: left;margin-left: 30px;">
                <tbody>
                <tr>
                    <th scope="col" width="60%" style="border-top-left-radius: 10px;">学生报名排行</th>
                    <th scope="col" width="40%" style="border-top-right-radius: 10px;">学生总数</th>
                </tr>
                <volist name="signUpList" id="vo" key="key">
                    <tr>
                        <td><span style="background:#fc2300;">{$key}</span>{$vo.username}</td>
                        <td>{$vo.count}</td>
                    </tr>
                </volist>
                </tbody>
            </table>
            <div class="divclear"></div>
        </div>


        <div class= "ct-title" style="margin-top: 60px;">
            <div class="ctt-bt">最新招生</div>
            <div class="divclear"></div>
        </div>

        <div class="ct-table">
            <table width="100%" border="0">
                <tbody>
                <tr>
                    <th scope="col" width="25%" style="border-top-left-radius: 10px;">姓名</th>
                    <!--<th scope="col" width="25%">类型</th>-->
                    <th scope="col" width="25%">对接人</th>
                    <th scope="col" width="25%" style="border-top-right-radius: 10px;">入驻时间</th>
                </tr>
                <volist name="news" id="vo" key="key">
                    <tr>
                        <td>{$vo.name}</td>
                        <!--<td>面授课</td>-->
                        <td>{$vo.username}</td>
                        <td>{$vo.create_time|date='Y-m-d',###}</td>
                    </tr>
                </volist>
                </tbody>
            </table>
        </div>
    </div>

</div>

</body>
<script type="text/javascript">
    function retrieval(search){
        var url="{:U('Home/Index/index')}";
        url=url+"&search="+search;
        location.href=url;
    }

    function query(){
        var start_time = $("input[name='start_time']").val();
        var end_time = $("input[name='end_time']").val();
        var search = 4;
        var url="{:U('Home/Index/index')}";
        url=url+"&start_time="+start_time+"&end_time="+end_time+"&search="+search;
        location.href=url;
    }
</script>
<script type="text/javascript">
    var dom = document.getElementById("container");
    var myChart = echarts.init(dom);
    var app = {};
    //数据
    var line_title_str = "{$line_title}";//线条
    line_title = line_title_str.split(',');
    var line_time = "{$line_time}";//日期
    line_time = line_time.split(',');
    var thisYearAllDatas = "{$thisYearAllData}";//今年数据
    thisYearAllDatas = thisYearAllDatas.split(',');
    var allData = "{$allData}";//去年数据
    allData = allData.split(',');
    var year_personal_data = "{$year_personal_data}";//今年个人数据
    year_personal_data = year_personal_data.split(',');
    var personal_data = "{$personal_data}";//去年个人数据
    personal_data = personal_data.split(',');

    option = null;

    if(line_title_str == "总数据"){
        option = {
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data: line_title
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            toolbox: {
                feature: {
                    saveAsImage: {}
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: line_time
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    name: '总数据',
                    type: 'line',
                    stack: '总量',
                    data: allData
                }
            ]
        };
    }else {
        option = {
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data: line_title
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            toolbox: {
                feature: {
                    saveAsImage: {}
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: line_time
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    name: '去年数据',
                    type: 'line',
                    stack: '总量',
                    data: allData
                },
                {
                    name: '去年个人数据',
                    type: 'line',
                    stack: '总量',
                    data: personal_data
                },
                {
                    name: '今年数据',
                    type: 'line',
                    stack: '总量',
                    data: thisYearAllDatas
                },
                {
                    name: '今年个人数据',
                    type: 'line',
                    stack: '总量',
                    data: year_personal_data
                }
            ]
        };
    }

    if (option && typeof option === "object") {
        myChart.setOption(option, true);
    }
</script>
</html>
